<template>
  <div>useRoute 和 useRouter的使用操作： <button @click="skip">跳转到路由守卫</button></div>
</template>

<script lang="ts" setup>
import { useRoute, useRouter } from 'vue-router'

// 声明调用
const route = useRoute() // 获取参数
const router = useRouter() // 跳转

// 查看路由信息
console.log(route.query)

const skip = () => {
  // 路由跳转
  router.push('/beforeRoute')
}
</script>
<style scoped>
.my-box {
  display: flex;
}
/* 支持CSS变量注入v-bind(color) */
</style>
